<template>
    <div class="page">
        <div class="master-box block">
            <div class="title-view">总行法律合规部法律合规管理岗</div>
            <div class="label-view">薪资：<span class="text-red">40-60万/年</span></div>
            <div class="detail-box">
                <span class="left-text">
                    <div>工作地点：<span>深圳/北京</span></div>
                    <div>招聘人数：<span>2人</span></div>
                </span>
                <span class="right-text">
                    <div>学历要求：<span>硕士及以上</span></div>
                    <div>工作经验：<span>5年以上</span></div>
                </span>
            </div>
        </div>

        <div class="company-item app-right-icon block" @click="handleCompanyClick">
            <div class="content-box">
                <div class="name">深圳市前海大成金融服务有限公司</div>
                <div class="type">行业：<span>金融</span></div>
            </div>
            <div class="text-blue">5个职位</div>
        </div>

        <advertisement-box class="block" img="http://img5.imgtn.bdimg.com/it/u=4169032523,1297392994&fm=27&gp=0.jpg"/>

        <text-description class="block" title="职位描述" :content="description"/>
        <text-description class="block" title="应聘须知" :content="description"/>
        <text-description class="block" title="特别提醒" :content="description"/>

        <min-title-bar title="职位推荐"/>

        <workplace-item v-for="(item, k) in workplaceList" :data="item" :key="k"/>

    </div>
</template>

<style lang="less" scoped>

    @import '../../style/variable';

    .page{
        .block{
            border-bottom: .8rem solid @color-bg-gray;
        }

        .master-box{
            padding: 0 1.5rem;
            .title-view{
                font-size: 2.2rem;
                line-height: 2.9rem;
                padding: 1.5rem 0 1.3rem;
                font-weight: bold;
            }
            .label-view{
                font-size: 1.7rem;
                line-height: 2.4rem;
                margin-bottom: 1.4rem;
                font-weight: bold;
            }
            .detail-box{
                font-size: 1.4rem;
                line-height: 2rem;
                display: flex;
                padding: 0 0 1.8rem;
                .left-text, .right-text{
                    flex: 1;
                    color: @color-text-gray;
                    span{
                        color: @color-text-black;
                    }
                }
            }
        }

        .company-item{
            display: flex;
            align-items: center;
            padding: 1.5rem;

            .content-box{
                flex: 1;

                .name{
                    font-size: 1.5rem;
                    line-height: 2.6rem;
                }

                .type{
                    font-size: 1.3rem;
                    line-height: 1.4rem;
                    color: @color-text-gray;
                }
            }
            .text-blue{
                font-size: 1.4rem;
                line-height: 2.4rem;
                margin-right: 1.5rem;
            }
        }


    }
</style>

<script>

    import {workPlace} from 'api'

    export default {
        data(){
            const workplaceList = Array(4).fill({
                title: '债券发行部北京分部负责人',
                amount: '60-100W',
                place: '北京',
                name: '第一创业证券股份有限公司厦门分公司',
                date: '2018-09-09',
                setUp: true
            });

            return {
                description: [
                    '一、进行银行同业业务的管理',
                    '二、负责统筹和执行管理型基金和杠杆性的发行与销',
                    '三、负责开拓基金代销渠道，与各大银行、信托、基金管理公司、证券公司等金融机构高层合作，建立良好的战略合作伙伴关系；',
                    '四、负责团队的建设与管理，带领团队推进业务的有效开展'
                ],
                workplaceList
            }
        },
        created(){
            this.$store.commit('hideNav', true);
            this.requestData();
        },
        methods: {
            requestData(){
                const {id} = this.$route.query;
                this.$axios.get(workPlace.API_WORK_PLACE_DETAIL, {
                    params: {id}
                }).then(({data})=>{
                    console.log(data);
                })
            },
            handleCompanyClick(){
                this.$router.push('/workplace/companyDetail?id=id')
            }
        }
    }
</script>